<!-- Layout 母模板 -->
<% extend('../../template/layout.art') %>

    <!-- body -->
    <% block('content', function(){ %>

        <div class="je-p20" id="content">
            <div class="serchHead">
                <div class="serchHeadSerch ">
                    <select class="myselect" id="transactionTypeId">
                                <option value="0">年卡卡号</option>
                                <option value="1">证件号码</option>
                                <option value="2">客户姓名</option>
                                <option value="3">联系方式</option>
                            </select>
                    <input type="text" placeholder="请输入卡号" class="je-input input-300 cardnum" />
                    <input type="text" placeholder="请输入身份证号码" class="je-input input-300 idnum" />
                    <input type="text" placeholder="请输入用户姓名" class="je-input input-300 name" />
                    <input type="text" placeholder="请输入手机号码" class="je-input input-300 phone" />
                    <input type="button" class="je-btn je-btn-small je-btn-normal serch-btn serch-card" value="查询">
                    <input type="button" class="je-btn je-btn-small je-btn-normal serch-btn" disabled value="读卡">
                    <input type="button" class="je-btn je-btn-small je-btn-normal serch-btn" disabled value="读身份证">
                </div>
                <div>
                    <table class="je-table">
                        <thead>
                            <tr>
                                <th>持卡人</th>
                                <th>卡面标号</th>
                                <th>注册证件</th>
                                <th>余额</th>
                                <th>有效期</th>
                                <th>开卡时间</th>
                                <th>状态</th>
                            </tr>
                        </thead>
                        <tbody class="card-info">

                        </tbody>
                    </table>
                </div>
            </div>
            <div class="serchBody">
                <h3>账号信息</h3>
                <table class="je-table" id="user-card">

                </table>
            </div>
            <div class="serchfood">
                <ul>
                    <li>信息补录</li>
                    <li>充值</li>
                    <li>退余额</li>
                    <li>续期</li>
                    <li>升起</li>
                    <li>换卡/不卡</li>
                    <li>挂失</li>
                    <li>冻结</li>
                    <li>重新激活</li>
                    <li>注销</li>
                    <li>操作记录</li>
                    <li>检票记录</li>
                    <li>消费记录</li>
                </ul>
            </div>
        </div>
        <script type="html" id="card-info">
            <tr>
                <td>{cardOwner}</td>
                <td>{cardFaceId}</td>
                <td>{idNumber}</td>
                <td>{amount}</td>
                <td>{endDate}</td>
                <td>{cardOwner}</td>
                <td>{status}</td>
            </tr>
        </script>
        <script type="html" id="user-card">
            <tr>
                <td>持卡人:{cardOwner}</td>
                <td>年卡信息:</td>
                <td>年卡状态:{status}</td>
            </tr>
            <tr>
                <td>出生日期:{birthday}</td>
                <td>年卡类型:{name}</td>
                <td>有效期:{endDate}</td>
            </tr>
            <tr>
                <td>注册证件:{idNumber}</td>
                <td>卡面编号:{cardFaceId}</td>
                <td>最近检票:</td>
            </tr>
            <tr>
                <td>电话:{contact}</td>
                <td>卡内余额:{amount}</td>
                <td>状态:</td>
            </tr>
            <tr>
                <td>职位:{position}</td>
                <td>检票次数:</td>
                <td>开卡时间:{createTime}</td>
            </tr>
            <tr>
                <td>公司:{employer}</td>
                <td>剩余次数:{checkedTime}</td>
            </tr>
            <tr>
                <td>地址:{address}</td>
            </tr>
            <tr>
                <td>开卡人员:{saler}</td>
            </tr>
        </script>
        <script type="text/javascript">
            jeui.use(["jquery", "jeBox", "jeLayout", "jeTabPane", "jeAccordion", "jeCheck", "jeDate", "jeNavTab", "jeProgress", "jeSelect", "jeDropdown", "jeTable"], function() {
                $(".myselect").jeSelect({
                    sosList: false,
                    itemfun: function(elem, index, val) {
                        switch (val) {
                            case '1':
                                $(".cardnum").css('display', 'none');
                                $(".idnum").css('display', 'inline-block');
                                $(".name").css('display', 'none');
                                $(".phone").css('display', 'none');
                                break;
                            case '2':
                                $(".cardnum").css('display', 'none');
                                $(".idnum").css('display', 'none');
                                $(".name").css('display', 'inline-block');
                                $(".phone").css('display', 'none');
                                break;
                            case '3':
                                $(".cardnum").css('display', 'none');
                                $(".idnum").css('display', 'none');
                                $(".name").css('display', 'none');
                                $(".phone").css('display', 'inline-block');
                                break;
                            case "0":
                                $(".cardnum").css('display', 'inline-block');
                                $(".idnum").css('display', 'none');
                                $(".name").css('display', 'none');
                                $(".phone").css('display', 'none');
                        }
                    }
                });
            })
        </script>

        <% }) %>